* {
  margin: 0;
  padding: 0
}
html, body {
  height: 100%;
}
div {
  height: 100%;
}
.box_1 {
  background: plum no-repeat 0px 0px/cover fixed;
}
.box_2 {
  background: skyblue no-repeat 0px 0px/cover fixed;
}
.box_3 {
  background: yellow no-repeat 0px 0px/cover fixed;
}
p {
  border: 2px solid #4caf50;
}
p.a {
  outline: dotted 20px;
}
p.b {
  outline: dashed thick skyblue;
}
p.c {
  outline: solid medium blue;
}
p.d {
  outline: double thin rgb(252, 0, 0);
  /* 轮廓与元素边框的空隙 */
  outline-offset: 5px;
}

/* 
  盒子：有  
  标准盒模型  : 长度为  width+padding+border+margin
  与
  怪异盒模型(box-sizing: border-box): 该盒子会使总长度为 ==> width+外边距margin, padding和border会包含在width内

*/